<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
    </style>
</head>
<body>
<a href="8-25-work-2.html">自定义菜单栏</a>
</body>

<script>
    var body = document.getElementsByTagName("body")[0]

    document.onclick = function (e) {
        console.log(e.clientX)
        console.log(e.clientY)
        var x = e.clientX
        var y = e.clientY
        var divElement = document.createElement("div")
        var widths = Math.random()*150
        if (widths<10){
            widths = 30
        }
        var bgcolor1 = Math.random()*256
        var bgcolor2 = Math.random()*256
        var bgcolor3 = Math.random()*256
        divElement.style.width = widths + 'px'
        divElement.style.height = widths + 'px'
        divElement.style.backgroundColor = `rgba(${bgcolor1},${bgcolor2},${bgcolor3})`
        divElement.style.position = 'absolute'
        divElement.style.top = (y-(widths/2)) + 'px'
        divElement.style.left = (x-(widths/2)) + 'px'
        body.appendChild(divElement)
    }



</script>

</html>